<!DOCTYPE html>
<html>
<head>
	<title>Memlib</title>
	<script src="../../script/jq.js"></script>
	<script src="../../script/login_check.js"></script>
	<script src="../../script/scale-suit.js"></script>
	<script src="../../script/are-u-sure.js"></script>
	<script src="../../script/CreatePrivateList.js"></script>
	<script>
		$(function(){
			$(".add-word-key-input").bind(' input propertychange ',function (){
				let str = $(this).val();
				let end = str.charAt(str.length - 1)
				if (end == '@') {
					$(this).val(str.substring(0,str.length-1));
					$(this).next().focus();
				}
			});
			$(".add-word-value-input").bind(' input propertychange ',function (){
				let str = $(this).val();
				let end = str.charAt(str.length - 1)
				if (end == '@') {
					$(this).val(str.substring(0,str.length-1));
					addCol();
					let ele = $(this);
					setTimeout(function (){
						ele.parent().next().children().eq(0).focus();
					},200);
				}
			});
			$(".add-word-key-input").focus(function (){
				$(this).removeAttr("placeholder");
				//$(this).attr("placeholder","提示词(中文释义)");
			}).blur(function(){
				$(this).attr("placeholder","提示词(中文释义)");
			});
			$(".add-word-value-input").focus(function (){
				$(this).removeAttr("placeholder");
			}).blur(function(){
				$(this).attr("placeholder","答案词(英文)");
			});
		});
	</script>
	<link rel="stylesheet" type="text/css" href="../../style/style.css">
	<link rel="stylesheet" type="text/css" href="../../style/animation.css">
	<link rel="stylesheet" type="text/css" href="../../style/CreatePrivateList.css">
	<meta charset="utf-8">
<body>
	<div id="main">
		<div id="notice">创建一个单词表吧</div>
		<div id="add-word-card-zero" class="add-word-card simple-slide-left">
			<input class="add-word-key-input" type="text" name="key" placeholder="提示词(中文释义)" required>
			<input class="add-word-value-input" type="text" name="value" placeholder="答案词(英文)" required>
			<div class="add-word-card-delete circle"></div>
		</div>
		<div id="add-word-sign-wrapper">
			<div id="add-word-plus-sign" class="circle"></div>
			<div id="add-word-finish-sign" class="circle"></div>
		</div>
		<p style="display: inline-block;color: #a6a6a6;position: relative;right: -120px;bottom: -10px;font-size: 27px;margin: 0px">ps: 在答案输入框中输入“@”会自动新建一行单词</p>
	</div>
</body>
</html>
